<template>
  <el-form ref="form" label-position="right" :model="currentRow" :rules="rules" label-suffix="："
           label-width="100px">
    <el-card shadow="always">
      <p class="info-title">
        {{model}}
      </p>
      <!-- 销号申请-->
      <div v-if="model === '销号'">
        <div class="geology-children">
          证明材料上传
        </div>
        <el-form-item prop="rectificationFileList">
          <upload-file prop="rectificationFileList" v-model="currentRow.rectificationFileList"
                       ref="uploadClear"></upload-file>
        </el-form-item>
        <div class="geology-children">
          说明
        </div>
        <el-form-item>
          <el-input v-model="currentRow.rectificationRemark" clearable  type="textarea" :rows="4"></el-input>
        </el-form-item>
      </div>
        <!--审批-->
      <div  v-if=" model === '核查'" class="spot-check-base3">
        <div class="geology-children">
          证明材料
        </div>
        <div v-for="(item,index) in fileList2" :key="index" style="text-align: center;display: inline-block;margin-left: 20px;font-size: 20px">
          <a :download="item.name" :href="item.url" style="color:black">
            <i class="iconfont iconPDF" style="font-size: 70px;color:red"></i>
            <br/>
            {{item.name}}
          </a>
        </div>
        <div class="geology-children">
          说明
        </div>
        <el-form-item>
          <el-input v-model="currentRow.rectificationRemark" clearable  type="textarea" :rows="4"></el-input>
        </el-form-item>
      </div>
    </el-card>

  </el-form>
</template>
<script>
import ItemMixins from "../../investigation/modules/item.mixins";
import constUrl from '@/services/env'
import UploadFile from '@/components/upload-file'

export default {
  props: ['value', 'model'],
  mixins: [ItemMixins],
  components: {UploadFile},
  data() {
    return {
      // 单位信息表单 校验规则
      rules: {
        rectificationFileList: {required: true, message: '请上传证明材料'},
      },
      constUrl,
    }
  },
  computed: {
    fileList2(){
      return this.filePathHandle(this.currentRow.rectificationFileList)
    },
    currentRow: {
      get() {
        return this.value
      },
      set(value) {
        this.$emit('input', value)
      }
    }
  },
  methods: {
    // 内部表单校验
    _validatorForm() {
      return new Promise((resolve) => {
        this.$refs.form.validate((valid) => {
          valid && resolve()
        })
      })
    }
  },
  mounted() {
  },
  created() {
  },
  activated() {
    this.$nextTick(() =>
      this.$refs.form.clearValidate()
    )
  }
}
</script>

<style lang="less">
  .el-date-editor.el-input, .el-date-editor.el-input__inner {
    width: 298px !important;
  }
  .spot-check-base3 {
    padding: 20px;
    .info-title {
      font-size: 17px;
      color: #1990FE;
      font-weight: 600;
      margin-bottom: 10px;
    }

    .info {
      font-size: 15px;
      margin-left: 20px;
      color: #8c939d;
    }
  }
  .geology-children {
    font-size: 15px;
    border-bottom: 1px solid;
    margin-bottom: 20px;
    margin-top: 20px;
    margin-left: 20px;
  }

  .info-title {
    font-size: 18px;
    color: #1990FE;
    font-weight: 600;
    margin-bottom: 10px;
  }

  .el-card {
    margin-bottom: 20px;
  }

  .form_compact {
    display: flex;

    & /deep/ .el-input input {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }

    & /deep/ .el-button {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  }

  .el-button {
    padding-right: 40px;
  }

  .el-form-item__label {
    /*padding: 0px;*/
  }

  input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
  }
</style>
